{% macro main_navbar(name) -%}
    <nav class="navbar navbar-default navbar-fixed-top">
      <div class="container-fluid">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="/">Project Radar</a>
        </div>
        
        <div id="navbar" class="navbar-collapse collapse">
          <ul class="nav navbar-nav">
              
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Manage <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="/user/">Users</a></li>
                <li><a href="/project/">Projects</a></li>
                <!--
                <li role="separator" class="divider"></li>
                <li class="dropdown-header">Nav header</li>
                <li><a href="#">Separated link</a></li>
                <li><a href="#">One more separated link</a></li>
                -->
              </ul>
            </li>
            
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Misc. <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="/about/project-goals">Project goals</a></li>
                <li><a href="/about/development-stack">Development stack</a></li>
                <!--
                <li role="separator" class="divider"></li>
                <li class="dropdown-header">Nav header</li>
                <li><a href="#">Separated link</a></li>
                <li><a href="#">One more separated link</a></li>
                -->
              </ul>
            </li>
            
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Modules <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li class="dropdown-header">To do projects</li>
                <li><a href="/about/project-goals">Property Market</a></li>
                <li><a href="/about/development-stack">Tinder CLone</a></li>
                <li><a href="/about/development-stack">Resource Scheduler</a></li>
                <li><a href="/about/development-stack">Forms.io clone</a></li>
                <li><a href="/about/development-stack">Workflow editor</a></li>
                <li><a href="/about/development-stack">Payroll</a></li>
                <li><a href="/about/development-stack">Leave system</a></li>
                <li><a href="/about/development-stack">Employee system</a></li>
                <!--
                <li role="separator" class="divider"></li>
                
                <li><a href="#">Separated link</a></li>
                <li><a href="#">One more separated link</a></li>
                -->
              </ul>
            </li>
            
            <!--
            <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Learn <span class="caret"></span></a>
              <ul class="dropdown-menu">
                <li><a href="#">Action</a></li>
                <li><a href="#">Another action</a></li>
                <li><a href="#">Something else here</a></li>
                <li role="separator" class="divider"></li>
                <li class="dropdown-header">Nav header</li>
                <li><a href="#">Separated link</a></li>
                <li><a href="#">One more separated link</a></li>
              </ul>
            </li>
            -->
          </ul>
          
          
          <div class="navbar-right">
            {% if logged_in_user %}
            <p class="form-control-static">
                <a href="{{logout_url}}" class="btn btn-default">Sign out {{logged_in_user}}</a>&nbsp;
            </p>
            {% else %}
            <p class="form-control-static">
                <a href="{{login_url}}" class="btn btn-default">Sign in</a>&nbsp;
            </p>
            {% endif %}
            {{user}}
          </div>
          
          <!--
          <ul class="nav navbar-nav navbar-right">
            <li><a href="../navbar/">Default</a></li>
            <li><a href="../navbar-static-top/">Static top</a></li>
            <li class="active"><a href="./">Fixed top <span class="sr-only">(current)</span></a></li>
          </ul>
          -->
        </div>
      </div>
    </nav>
{%- endmacro %}

{% macro side_navpanel(name) -%}
<div class="panel panel-default">
    <!-- Default panel contents -->
    <div class="panel-heading">User</div>
    <!--<div class="panel-body">
        <p>...</p>
    </div>-->

    <ul class="list-group">
          <li class="list-group-item"><a href="/user/" class="active" >List</a></li>
          <li class="list-group-item"><a href="/user/add">Add</a></li>
          <li class="list-group-item"><a href="/user/search">Search</a></li>
    </ul>
</div>
{%- endmacro %}

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title>{% block head_title %}Web Page{% endblock %} | Project Radar</title>

    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootswatch/3.3.6/lumen/bootstrap.min.css" />
    <link rel="stylesheet" href="/css/site.css" />

    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
      
    <!-- Fixed navbar -->
    {% block navbar_top %}
      {{ main_navbar('home') }}
    {% endblock %}

    {% block body %}
    <h1>Hello, world!</h1>
    {% endblock %}

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" ></script>
    {% block scripts %}{% endblock %}
  </body>
</html>